// pages/video/video.js
import request from '../../utils/request'
Page({

    /**
     * 页面的初始数据
     */
    data: {
        videoGroupList: [], // 导航标签数据
        navId: '', // 导航的标识
        videoList: [], // 视频列表数据
        videoId: '', // video的标识
        videoUpdateTime: [], // 记录video播放的时长
        isTriggered: false, // 标识下拉刷新是否被触发
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        // 获取导航数据
        this.getVideoGroupListData()
    },

    // 获取导航数据
    async getVideoGroupListData() {
        let videoGroupListData = await request('/video/group/list')
        // console.log(videoGroupListData.data.splice(0, 1));
        this.setData({
            videoGroupList: videoGroupListData.data.slice(0, 14),
            navId: videoGroupListData.data[0].id
        })
        // 获取视频列表数据
        this.getVideoList(this.data.navId)
    },
    // 获取视频列表数据
    async getVideoList(navId) {
        if (!navId) { // 判断navId为空串的情况
            return;
        }
        let videoListData = await request('/video/group', {id: navId})
        // 关闭消息提示框
        wx.hideLoading()

        let index = 0
        let videoList = videoListData.datas.map(item => {
            item.id = index++
            return item
        })
        // console.log(videoListData);
        this.setData({
            videoList,
            isTriggered: false // 关闭下拉刷新
        })
    },
    // 点击切换导航的回调
    changeNav(event) {
        // 通过id向event传参的时候如果传的是number会自动转换成string
        // let navId = event.currentTarget.id
        let navId = event.currentTarget.dataset.id
        this.setData({
            navId,// *1 >>>0 转成number 或者 把===转成==
            videoList: []
        })

        // 显示正在加载
        wx.showLoading({
          title: '正在加载',
        })
        // 动态获取当前导航对应的视频数据
        this.getVideoList(this.data.navId)
    },
    // 点击播放/继续播放的回调
    handlePlay(event) {
        let vid = event.currentTarget.id
        // 关闭上一个播放的视频
        // if (this.vid !== vid) { // 判断当前播放视频之前是否有播放过其他视频
        //     if (this.videoContext) { 
        //         this.videoContext.stop()
        //     }
        // }

        // this.vid !== vid && this.videoContext && this.videoContext.stop()
        // this.vid = vid
        
        this.setData({
            videoId: vid
        })
        // 创建控制video标签的实例对象
        this.videoContext = wx.createVideoContext(vid)

        let videoItem = this.data.videoUpdateTime.find(item => vid === item.vid)
        if (videoItem) {
            this.videoContext.seek(videoItem.currentTime)
        }
    },
    // 监听视频播放进度的回调
    handleTimeUpdate(event) {
        let videoTimeObj = { vid: event.currentTarget.id, currentTime: event.detail.currentTime}
        let {videoUpdateTime} = this.data
        let videoItem = videoUpdateTime.find(item => item.vid === videoTimeObj.vid)
        if (videoItem) { // 已存在则更新时间
            videoItem.currentTime = event.detail.currentTime
        } else { // 不存在则加入到列表中
            videoUpdateTime.push(videoTimeObj)
        }
        // 更新videoUpdateTime的状态
        this.setData({
            videoUpdateTime
        })
    },
    // 视频播放结束的回调
    handleVideoEnd(event) { 
        // 移除记录播放时长数组中当前视频的对象
        let {videoUpdateTime} = this.data
        videoUpdateTime.splice(videoUpdateTime.findIndex(item => item.vid === event.currentTarget.id), 1)
        this.setData({
            videoUpdateTime
        })
    },
    // 自定义下拉刷新的回调
    handleRefresher() {
        // 再次发送请求，获取最新数据
        this.getVideoList(this.data.navId)
    },
    // 自定义上拉触底的回调
    handleToLower() {
        // 发送请求，前端进行分页，截取最新的数据追加到视频列表后（网易云暂时没有提供分页的api）
        // let videoList = this.data.videoList
        // videoList.push(...videoList)
        // this.setData({
        //     videoList
        // })
        wx.showToast({
          title: '没有了，别拉了'
        })
    },
    // 跳转至搜索音乐界面
    toSearch() {
        wx.navigateTo({
          url: '/pages/search/search',
        })
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function ({from}) {
        console.log(from);
    }
})